<template>
    <div>
         <van-field
            v-model="form.name"
            name="name"
            label="名称"
            placeholder="名称"
            :rules="[{ required: true, message: '请填写名称' }]"
          />
          <van-button @click="add" round>添加</van-button>

          <table>
              <tr>
                  <td>id</td>
                  <td>名称</td>
                  <td>等级</td>
                  <td>操作</td>
              </tr>
              <tr v-for="i in ncatelist">
                  <td>{{i.id}}</td>
                  <td>{{i.name}}</td>
                  <td>{{i.types}}</td>
                  <td>
                      <van-button round @click="del(i.id)">删除</van-button>
                      <van-button round @click="change(i.id)">修改</van-button>

                  </td>
              </tr>
          </table>

    </div>
</template>

<script>
    export default {
        data() {
            return {
                form:{},
                ncatelist:[]
            }
        },

        methods: {
            add(){
                this.$axios.post('/add_ncate',this.form)
                .then((res)=> {
                    if(res.data.code==200){
                        alert('添加成功')
                        this.form = {}
                        this.get_ncate()
                    }
                    
                }).catch((err) => {
                    alert('添加失败')
                    
                });

            },
            get_ncate(){
                this.$axios.get('/add_ncate')
                .then(res=>{
                    if(res.data.code==200){
                        this.ncatelist=res.data.list
                    }
                })
            },
            del(id){
                this.$axios.delete('/add_ncate?id='+id)
                .then(res=>{
                    if(res.data.code==200){
                        alert('删除成功')
                        this.get_ncate()
                    }
                })
            },
            change(id){
                this.$router.push({path:'/ncate2',query:{'id':id}})
            }
        },
        mounted() {
            this.get_ncate()
        },
    }

</script>

<style scoped>

</style>